<!--
 * @Descripttion: 交易设置
 * @Author: xiao li
 * @Date: 2020-07-06 12:17:07
 * @LastEditors: xiao li
 * @LastEditTime: 2021-11-19 18:38:10
-->
<template>
  <div class="lb-deal-set">
    <top-nav />
    <div class="page-main">
      <el-tabs type="border-card">
        <el-tab-pane label="订单超时">
          <el-form
            @submit.native.prevent
            :model="overtimeForm"
            :rules="overtimeFormRules"
            ref="overtimeForm"
            label-width="120px"
          >
            <el-form-item label="订单超时" prop="order_overtime">
              <el-input
                v-model.number="overtimeForm.order_overtime"
                placeholder="请输入秒数"
              ></el-input>
              <lb-tool-tips
                >订单未支付超时时间, 超时将自动取消订单, 单位: 秒</lb-tool-tips
              >
            </el-form-item>
            <el-form-item label="拼团超时" prop="collage_overtime">
              <el-input
                v-model.number="overtimeForm.collage_overtime"
                placeholder="请输入秒数"
              ></el-input>
              <lb-tool-tips
                >拼团未成功超时时间, 超时将自动取消订单并退出拼团, 单位:
                秒</lb-tool-tips
              >
            </el-form-item>
            <el-form-item>
              <lb-button type="primary" @click="submitForm('overtimeForm')">{{
                $t('action.submit')
              }}</lb-button>
            </el-form-item>
          </el-form>
        </el-tab-pane>
        <el-tab-pane label="自提设置">
          <el-form
            @submit.native.prevent
            :model="pickupForm"
            :rules="pickupFormRules"
            ref="pickupForm"
            label-width="120px"
          >
            <el-form-item label="自动收货" prop="receiving">
              <el-input
                v-model.number="pickupForm.receiving"
                placeholder="请输入天数"
              ></el-input>
              <lb-tool-tips
                >后台发货后, 用户没有确认收货到时间后自动收货, 最少为5天, 单位:
                天</lb-tool-tips
              >
            </el-form-item>
            <div class="item-tips"></div>
            <el-form-item label="订单核销密码" prop="order_pwd">
              <el-input
                v-model.number="pickupForm.order_pwd"
                placeholder="请输入核销密码"
              ></el-input>
              <lb-tool-tips
                >此密码用于在小程序端核销用户自提订单,
                在小程序员工端核销订单处点击扫描客户的订单二维码并且正确输入此密码就能直接完成此订单,
                请谨慎操作。并且知道此密码的人都能完成核销订单操作，请注意保管密码以及及时更新密码</lb-tool-tips
              >
            </el-form-item>
            <el-form-item label="卡券核销密码" prop="coupon_pass">
              <el-input
                v-model.number="pickupForm.coupon_pass"
                placeholder="请输入核销密码"
              ></el-input>
              <lb-tool-tips
                >此密码用于在微信端核销用户卡券,
                在微信扫一扫扫描客户的卡券二维码并且正确输入此密码就能直接核销卡券,
                请谨慎操作。并且知道此密码的员工都能完成核销卡券操作，请注意保管密码以及及时更新密码</lb-tool-tips
              >
            </el-form-item>
            <el-form-item label="自提商品" prop="self_text">
              <el-input
                v-model="pickupForm.self_text"
                placeholder="请输入内容"
              ></el-input>
              <lb-tool-tips>自提商品文字提示内容</lb-tool-tips>
            </el-form-item>
            <el-form-item>
              <lb-button type="primary" @click="submitForm('pickupForm')">{{
                $t('action.submit')
              }}</lb-button>
            </el-form-item>
          </el-form>
        </el-tab-pane>
      </el-tabs>
    </div>
  </div>
</template>

<script>
export default {
  data () {
    let regDays = (rule, value, callback) => {
      console.log(!/^\+?[0-9]*$/.test(value) && value < 5)
      if (/^\+?[0-9]*$/.test(value) && value >= 5) {
        callback()
      } else {
        callback(new Error('请输入天数且大于等于5天'))
      }
    }
    let regCouponPwd = (rule, value, callback) => {
      if (!value) {
        callback(new Error('请输入数字'))
      } else if (!/^[0-9]{6}$/.test(value)) {
        callback(new Error('请输入6位数字密码'))
      } else {
        callback()
      }
    }
    return {
      activeName: 'overtimeForm',
      overtimeForm: {
        order_overtime: 0,
        collage_overtime: 0
      },
      overtimeFormRules: {
        order_overtime: {
          required: true,
          type: 'number',
          message: '请输入数字',
          trigger: 'blur'
        },
        collage_overtime: {
          required: true,
          type: 'number',
          message: '请输入数字',
          trigger: 'blur'
        }
      },
      pickupForm: {
        receiving: '',
        order_pwd: '',
        coupon_pass: '',
        self_text: ''
      },
      pickupFormRules: {
        receiving: {
          required: true,
          validator: regDays,
          trigger: 'blur'
        },
        order_pwd: {
          required: true,
          type: 'number',
          validator: regCouponPwd,
          trigger: 'blur'
        },
        coupon_pass: {
          required: true,
          type: 'number',
          validator: regCouponPwd,
          trigger: 'blur'
        }
      }
    }
  },
  components: {
  },
  created () {
    this.getSettingInfo()
  },
  methods: {
    /**
       * @method 获取设置数据回显
       */
    getSettingInfo () {
      this.$api.orderSettingInfo().then(res => {
        if (res.code === 200) {
          this.overtimeForm.order_overtime = res.data.order_overtime
          this.overtimeForm.collage_overtime = res.data.collage_overtime
          this.pickupForm.receiving = res.data.receiving
          this.pickupForm.order_pwd = res.data.order_pwd
          this.pickupForm.coupon_pass = res.data.coupon_pass
          this.pickupForm.self_text = res.data.self_text
        }
      })
    },
    /**
       * @method 保存设置
       */
    submitForm (name) {
      let subForm = this[name]
      this.$refs[name].validate(valid => {
        if (valid) {
          this.$api.orderSetting(subForm).then(res => {
            if (res.code === 200) {
              this.$message.success(this.$t('tips.successOper'))
            }
          })
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.lb-deal-set {
  width: 100%;

  .page-main {
    padding: 20px;

    .el-input {
      width: 300px;
    }
  }
}
</style>
